<%@ page import="java.util.List" %>
<%@ page import="com.wanmait.computershop.vo.Cart" %>
<%@ page import="java.util.ArrayList" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <!--edge浏览器H5兼容设置-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--360浏览器H5兼容设置-->
    <meta name="renderer" content="webkit" />
    <title>电脑商城</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--导入核心文件-->
    <script src="/computershop/static/web/bootstrap3/js/holder.js"></script>
    <link href="/computershop/static/web/bootstrap3/css/bootstrap.css" rel="stylesheet" type="text/css">
    <script src="/computershop/static/web/bootstrap3/jquery-1.9.1.min.js"></script>
    <script src="/computershop/static/web/bootstrap3/js/bootstrap.js"></script>
    <!-- 字体图标 -->
    <link rel="stylesheet" href="/computershop/static/web/bootstrap3/font-awesome-4.7.0/css/font-awesome.css" />
    <link rel="stylesheet" type="text/css" href="/computershop/static/web/css/layout.css" />
    <link rel="stylesheet" type="text/css" href="/computershop/static/web/css/top.css" />
    <link rel="stylesheet" type="text/css" href="/computershop/static/web/css/footer.css" />
    <link rel="stylesheet" type="text/css" href="/computershop/static/web/css/cart.css" />
    <script src="/computershop/static/web/js/cart.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
<!--头部-->
<jsp:include page="/WEB-INF/web/inc/header.jsp"></jsp:include>
<!--头部结束-->
<!--导航结束-->
<div class="container">
    <div class="col-md-offset-1 col-md-10">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <p class="panel-title"><span class="fa fa-shopping-cart"></span> 购物车</p>
            </div>
            <div class="panel-body">
                <form action="orderConfirm" role="form" id="cartForm">
                    <!--购物车表格开始-->
                    <table class="cart-table" width="100%">
                        <thead>
                        <tr>
                            <th width="8%">
                                <input type="checkbox" class="ckall" onclick="checkall(this)" id="chooseAll" />全选</th>
                            <th width="110"></th>
                            <th width="29%">商品</th>
                            <th width="11%">单价</th>
                            <th width="15%">数量</th>
                            <th width="11%">金额</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody id="cart-list" class="cart-body">
                        <c:forEach items="${requestScope.cartList}" var="cart">
                            <tr>
                                <td>
                                    <input type="checkbox" class="ckitem" name="ckitem" value="${cart.id}"/>
                                </td>
                                <td><img src="/computershop/static/web${cart.product.image}collect.png" class="img-responsive" /></td>
                                <td>${cart.product.title}</td>
                                <td>¥<span class="goodsPrice" id="goodsPrice1">${cart.product.price}</span></td>
                                <td>
                                        <%--                                <input type="button" value="-" class="num-btn" onclick="reduceNum(1)" />--%>
                                    <input type="button" class="minus" value="-">
                                    <input id="goodsCount1" type="text" size="2"  class="num-text" value="${cart.num}">
                                        <%--                                <input class="num-btn" type="button" value="+" onclick="addNum(1)" />--%>
                                    <input type="button" class="add" value="+">
                                            <br>库存：<span id="stocknum">${cart.product.stocknum}</span>
                                </td>

                                <td><span id="goodsCast1" class="subtotal" style="color: red;font-weight: bolder">${cart.price*cart.num}</span></td>
                                <td>
                                        <%--                                <input type="button" onclick="delCartItem(this)" class="cart-del btn btn-default btn-xs" value="删除" />--%>
                                    <input type="button" class="cart_del" value="删除" />
                                    <input type="hidden"  class="thisCartId" value="${cart.id}">
                                    <input type="hidden" class="thisProductName" value="${cart.product.title}">
                                </td>
                            </tr>
                        </c:forEach>
                        </tbody>
                    </table>
                    <div class="total-bar">
                        <a href="javascript:selDelCart()" class="cart-del-sel btn btn-default btn-xs">删除所选商品</a>
                        <span class="pull-right">已选商品
								<span id="selectCount" style="font-size: larger; color: red;font-weight: bold">0</span>件 总价¥
								<span id="selectTotal" style="font-size: larger; color: red;font-weight: bold">0</span>元
								</span>
                    </div>
                    <div>
								<span class="pull-right">
								<input  style="background-color: #2a6496;height: 40px;color: white;font-size: large" type="submit" value="  结  算  "  />
							</span>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!--页脚开始-->
<jsp:include page="/WEB-INF/web/inc/foot.jsp"></jsp:include>

</body>

</html>
<script>

    $(".num-text").change(function (){
        var goodsPrice1 = parseInt($(this).parent().parent().find(".goodsPrice").text());
        var cartId = $(this).parent().parent().find(".ckitem").val();
        var goodsCount1 = parseInt($(this).val());
        var stocknum = parseInt($(this).siblings("#stocknum").text());
        if (goodsCount1 > stocknum)
        {
            alert("库存数量不足");
            $(this).val(stocknum);
            $(this).parent().parent().find(".subtotal").text(stocknum*goodsPrice1);
            getTotal();
            getCount();
            $.ajax({
                url:"/computershop/web/updateCartNum",
                data:{id:cartId,num:stocknum},
                async:false,
                success:function (mes){}
            })
            getCartProductNum();
        }
        else
        {
            $(this).parent().parent().find(".subtotal").text(parseInt($(this).val())*goodsPrice1);
            getTotal();
            getCount();
            $.ajax({
                url:"/computershop/web/updateCartNum",
                data:{id:cartId,num:goodsCount1},
                async:false,
                success:function (mes){}
            })
            getCartProductNum();
        }
    });
</script>
<script>
    $(function (){

        $(".cart_del").click(function (){
            var productnum = $(this).siblings(".thisProductName").val();
            var checkDel =  confirm("确认删除 "+productnum+" 吗？");
            if(checkDel)
            {
                var cid = $(this).siblings(".thisCartId").val();
                //console.log(id);
                $.ajax({
                    url:"/computershop/web/delCart",
                    data:{cid:cid},
                    success:function (mes){
                        $("#cart_product_num").text(Number(mes));
                    }
                })
                $(this).parent().parent().remove();
                getTotal();
                getCount();
            }
            else {}
        });


        chooseAllgood();
        getTotal();
        getCount();

        $("#chooseAll").click(function(){
            //console.log($(this).prop("checked"));
            if($(this).prop("checked")){
                chooseAllgood();
                getTotal();
                getCount();
            }else{
                var goodsboxs = $("input[type=checkbox]");
                for(var i = 0 ; i < goodsboxs.length ; i++){
                    //console.log(chooseAll[i]);
                    $(goodsboxs[i]).prop("checked",false);
                }
                result = 0;
                $("#selectTotal").text(result);
                getCount();
            }
        });


        $(".cart-del").click(function(){
            $(this).parent().parent().remove();
            getTotal();
            getCount();
        });

        $(".add").click(function(){
            var stocknum = $(this).siblings("#stocknum").text();
            var cartId = $(this).parent().parent().find(".ckitem").val();
            var num = $(this).siblings(".num-text").val();
            num = parseInt(num);
            stocknum = parseInt(stocknum);

            if(num<stocknum){
                num++;
                $(this).siblings(".num-text").val(num);
                var price = $(this).parent().parent().find(".goodsPrice").text();
                price = parseFloat(price);
                var subtotal = num*price;
                $(this).parent().parent().find(".subtotal").text(subtotal);
                if($(this).parent().parent().find(".ckitem").prop("checked")){
                    getTotal();
                    getCount();
                }
                $.ajax({
                    url:"/computershop/web/updateCartNum",
                    async:false,
                    data:{id:cartId,num:num},
                    success:function (mes){}
                })
                getCartProductNum();
            }
            else{
                alert("库存不足");
            }

        })

        $(".minus").click(function(){
            var cartId = $(this).parent().parent().find(".ckitem").val();
            // console.log(cartId);
            //console.log($(this).siblings("input").val());
            var num = $(this).siblings(".num-text").val();
            num = parseInt(num);
            if(num>1){
                num--;
                $(this).siblings(".num-text").val(num);
                var price = $(this).parent().parent().find(".goodsPrice").text();
                price = parseFloat(price);
                var subtotal = num*price;
                $(this).parent().parent().find(".subtotal").text(subtotal);
                if($(this).parent().parent().find(".ckitem").prop("checked")){
                    getTotal();
                    getCount();
                }
                $.ajax({
                    url:"/computershop/web/updateCartNum",
                    async:false,
                    data:{id:cartId,num:num},
                    success:function (mes){}
                })
                getCartProductNum();

            }
            else{return;}
        })

        $(".ckitem").click(function(){
            //console.log($(this).prop("checked"));
            if($(this).prop("checked")){
                getTotal();
                getCount();
            }
            else{
                $("#chooseAll").prop("checked",false);
                getTotal();
                getCount();
            }
        });
    });

    function chooseAllgood(){
        var goodsboxs = $("input[type=checkbox]");
        for(var i = 0 ; i < goodsboxs.length ; i++){
            //console.log(chooseAll[i]);
            $(goodsboxs[i]).prop("checked",true);
        }
    }

    function getTotal(){
        var result = 0;
        var choosed = $(".ckitem");
        for(var i = 0 ; i < choosed.length ; i++){
            //console.log($(choosed[i]).prop("checked"));
            if($(choosed[i]).prop("checked")){
                var subtotal = $(choosed[i]).parent().parent().find(".subtotal").text();
                subtotal = parseFloat(subtotal);
                result += subtotal;
            }
        }
        $("#selectTotal").text(result);
    }

    function getCount(){
        var count = 0;
        var choosed = $(".ckitem");
        for(var i = 0 ; i < choosed.length ; i++){
            // console.log($(choosed[i]).prop("checked"));
            if($(choosed[i]).prop("checked")){
                var subCount = $(choosed[i]).parent().parent().find(".num-text").val();
                subCount = parseInt(subCount);
                count += subCount;
            }
        }
        $("#selectCount").text(count);
    }


</script>